<template>
  <div>
    <h3 class="charts-name">“{{user.user.Name}}”工资变化情况</h3>
    <div style="text-align: center;width: 60%; margin: 0 auto;">
 <v-chart v-if="isDataLoad" :options="opt1"/>
    </div>

  </div>
</template>

<script>
  export default {
    name:'',
    data () {
      return {
        user:{
            code:0,
            isAdmin:0,
            user:{
                BasicWage:0,
                BornDate:'',
                DepartmentGuid: "",
                EmployeeGuid: "",
                EmployeeNumber: 0,
                EnterDate: "",
                HeadShip: "",
                IsAdmin: "",
                Name: "",
                Password: "",
                Remark: "",
                SchoolAge: "",
                Sex: "",
                State: ""
            },

        },
           opt1:{
                 xAxis: {
                    type: 'category',
                    data: [],
                    name:'月份'
                },
                yAxis: {
                    type: 'value',
                      name:'工资'
                },
                series: [{
                    data: [],
                    type: 'line',

                }]
            },
            isDataLoad:false,
            data:[]
      };
    },
    mounted() {
        this.getData()
    },
    methods: {
       async getData(){
            this.user=await api.check().then(re=>re)
           this.data= await api.wagedetail(this.user.user.EmployeeGuid).then(res=>res.data)
           console.log(this.data)
           for(let item of this.data){
               this.opt1.xAxis.data.push(item.Month)
               this.opt1.series[0].data.push(item.FactWage)
           }
           this.isDataLoad=true
       }
    },
    watch: {
    },
  }
</script>
<style lang='' scoped>

</style>
